<script>
  import {link} from 'svelte-spa-router'
  // 判断当前账户是代理还是管理员
  import {onMount} from 'svelte'
  import {LoginType, ChanAccess} from '../service.js';
  import {Post} from '../lib/net.js';
  import {REDPOINT} from '../api.js';
  import Info from '../model/info.js';

  let isAdmin = false;
  let uid = -1;
  let agent_users = "/agent/users?agent_id="


  let adminOpenStatus = false
  let moneyOpenStatus = false
  let corpoOpenStatus = false
  let accountOpenStatus = false
  let otcOpenStatus = false
  let verOpenStatus = false
  let cashOpenStatus = false
  let otcBuy = 0
  let otcSell = 0
  let veri = 0
  let withdraw = 0
  let messages = '您有新的消息'
  let messageStatus = false
  onMount(() => {
    setInterval(() => {
      getRedPoint()
    }, 3000)
    let t = localStorage.getItem("uid");
    if (!t) t = "-1"
    isAdmin = t == "-1"
    uid = t;
    agent_users += uid;

    // let as = document.querySelectorAll('.nav-item');
    // for (let item of as) {
    //   item.addEventListener('click', active);
    // }
  })

  async function getRedPoint() {
    let res = await Post(REDPOINT);
    // console.log(res)
    if (res.otcBuy !== otcBuy) {
      messageStatus = true
      messages = '您有新的待交易'
      otcBuy = res.otcBuy
      setTimeout(() => {
        messageStatus = false
      }, 3000)
    } else {
      setTimeout(() => {
        messageStatus = false
      }, 3000)
    }
    if (res.otcSell !== otcSell) {
      messageStatus = true
      messages = '您有新的待交易'
      otcSell = res.otcSell
      setTimeout(() => {
        messageStatus = false
      }, 3000)
    } else {
      setTimeout(() => {
        messageStatus = false
      }, 3000)
    }
    if (res.veri !== veri) {
      messageStatus = true
      messages = '您有新的会员申请'
      veri = res.veri
      setTimeout(() => {
        messageStatus = false
      }, 3000)
    } else {
      setTimeout(() => {
        messageStatus = false
      }, 3000)
    }
    if (res.withdraw !== withdraw) {
      messageStatus = true
      messages = '提现申请'
      withdraw = res.withdraw
      setTimeout(() => {
        messageStatus = false
      }, 3000)
    } else {
      setTimeout(() => {
        messageStatus = false
      }, 3000)
    }
  }

  function active(e) {

    let as = document.querySelectorAll('.nav-item');
    for (let item of as) {
      item.className = "nav-nav-item-all svelte-10cr65n";
    }

    let el = e.target;
    el.className += "active";
  }

  function adminOpen() {
    adminOpenStatus = !adminOpenStatus
  }

  function moneyOpen() {
    moneyOpenStatus = !moneyOpenStatus
  }

  function corpoOpen() {
    corpoOpenStatus = !corpoOpenStatus
  }

  function accountOpen() {
    accountOpenStatus = !accountOpenStatus
  }

  function otcOpen() {
    otcOpenStatus = !otcOpenStatus
  }

  function close() {
    messageStatus = !messageStatus
  }

  function verOpen() {
    verOpenStatus = !verOpenStatus
  }

  function cashOpen() {
    cashOpenStatus = !cashOpenStatus
  }
//////////////////////////
  let chooseOne = false
  let chooseTwo = false
  let chooseThree = false
  let chooseFour = false
  let chooseFive = false
  let chooseSix = false
  let chooseSeven = false
  let chooseEight = false
  let chooseNine = false
  let chooseTen = false
  let chooseTenOne = false
  let chooseTenTwo = false
  let chooseTenThree = false
  let chooseTenFour = false
  let chooseTenFive = false
  let chooseTenSix = false
  let chooseTenSeven = false

  function choose1() {
    chooseOne = !chooseOne
		chooseTwo = false
		chooseThree = false
		chooseFour = false
		chooseFive = false
		chooseSix = false
		chooseSeven = false
		chooseEight = false
		chooseNine = false
		chooseTen = false
		chooseTenOne = false
		chooseTenTwo = false
		chooseTenThree = false
		chooseTenFour = false
		chooseTenFive = false
		chooseTenSix = false
		chooseTenSeven = false
  }
  function choose2() {
    chooseTwo = true
    chooseOne = false
    chooseThree = false
    chooseFour = false
    chooseFive = false
    chooseSix = false
    chooseSeven = false
    chooseEight = false
    chooseNine = false
    chooseTen = false
    chooseTenOne = false
    chooseTenTwo = false
    chooseTenThree = false
    chooseTenFour = false
    chooseTenFive = false
    chooseTenSix = false
    chooseTenSeven = false
  }
  function choose3() {
    chooseThree = true
    chooseOne = false
    chooseTwo = false
    chooseFour = false
    chooseFive = false
    chooseSix = false
    chooseSeven = false
    chooseEight = false
    chooseNine = false
    chooseTen = false
    chooseTenOne = false
    chooseTenTwo = false
    chooseTenThree = false
    chooseTenFour = false
    chooseTenFive = false
    chooseTenSix = false
    chooseTenSeven = false
  }
  function choose4() {
    chooseFour = true
    chooseOne = false
    chooseTwo = false
    chooseThree = false
    chooseFive = false
    chooseSix = false
    chooseSeven = false
    chooseEight = false
    chooseNine = false
    chooseTen = false
    chooseTenOne = false
    chooseTenTwo = false
    chooseTenThree = false
    chooseTenFour = false
    chooseTenFive = false
    chooseTenSix = false
    chooseTenSeven = false
  }
  function choose5() {
    chooseFive = true
    chooseOne = false
    chooseTwo = false
    chooseThree = false
    chooseFour = false
    chooseSix = false
    chooseSeven = false
    chooseEight = false
    chooseNine = false
    chooseTen = false
    chooseTenOne = false
    chooseTenTwo = false
    chooseTenThree = false
    chooseTenFour = false
    chooseTenFive = false
    chooseTenSix = false
    chooseTenSeven = false
  }
  function choose6() {
    chooseSix = true
    chooseOne = false
    chooseTwo = false
    chooseThree = false
    chooseFour = false
    chooseFive = false
    chooseSeven = false
    chooseEight = false
    chooseNine = false
    chooseTen = false
    chooseTenOne = false
    chooseTenTwo = false
    chooseTenThree = false
    chooseTenFour = false
    chooseTenFive = false
    chooseTenSix = false
    chooseTenSeven = false
  }
  function choose7() {
    chooseSeven = true
    chooseOne = false
    chooseTwo = false
    chooseThree = false
    chooseFour = false
    chooseFive = false
    chooseSix = false
    chooseEight = false
    chooseNine = false
    chooseTen = false
    chooseTenOne = false
    chooseTenTwo = false
    chooseTenThree = false
    chooseTenFour = false
    chooseTenFive = false
    chooseTenSix = false
    chooseTenSeven = false
  }
  function choose8() {
    chooseEight = true
    chooseOne = false
    chooseTwo = false
    chooseThree = false
    chooseFour = false
    chooseFive = false
    chooseSix = false
    chooseSeven = false
    chooseNine = false
    chooseTen = false
    chooseTenOne = false
    chooseTenTwo = false
    chooseTenThree = false
    chooseTenFour = false
    chooseTenFive = false
    chooseTenSix = false
    chooseTenSeven = false
  }
  function choose9() {
    chooseNine = true
    chooseOne = false
    chooseTwo = false
    chooseThree = false
    chooseFour = false
    chooseFive = false
    chooseSix = false
    chooseSeven = false
    chooseEight = false
    chooseTen = false
    chooseTenOne = false
    chooseTenTwo = false
    chooseTenThree = false
    chooseTenFour = false
    chooseTenFive = false
    chooseTenSix = false
    chooseTenSeven = false
  }
  function choose10() {
    chooseTen = true
    chooseOne = false
    chooseTwo = false
    chooseThree = false
    chooseFour = false
    chooseFive = false
    chooseSix = false
    chooseSeven = false
    chooseEight = false
    chooseNine = false
    chooseTenOne = false
    chooseTenTwo = false
    chooseTenThree = false
    chooseTenFour = false
    chooseTenFive = false
    chooseTenSix = false
    chooseTenSeven = false
  }
  function choose11() {
    chooseTenOne = true
    chooseOne = false
    chooseTwo = false
    chooseThree = false
    chooseFour = false
    chooseFive = false
    chooseSix = false
    chooseSeven = false
    chooseEight = false
    chooseNine = false
    chooseTen = false
    chooseTenTwo = false
    chooseTenThree = false
    chooseTenFour = false
    chooseTenFive = false
    chooseTenSix = false
    chooseTenSeven = false
  }
  function choose12() {
    chooseTenTwo = true
    chooseOne = false
    chooseTwo = false
    chooseThree = false
    chooseFour = false
    chooseFive = false
    chooseSix = false
    chooseSeven = false
    chooseEight = false
    chooseNine = false
    chooseTen = false
    chooseTenOne = false
    chooseTenThree = false
    chooseTenFour = false
    chooseTenFive = false
    chooseTenSix = false
    chooseTenSeven = false
  }
  function choose13() {
    chooseTenThree = true
    chooseOne = false
    chooseTwo = false
    chooseThree = false
    chooseFour = false
    chooseFive = false
    chooseSix = false
    chooseSeven = false
    chooseEight = false
    chooseNine = false
    chooseTen = false
    chooseTenOne = false
    chooseTenTwo = false
    chooseTenFour = false
    chooseTenFive = false
    chooseTenSix = false
    chooseTenSeven = false
  }
  function choose14() {
    chooseTenFour = true
    chooseOne = false
    chooseTwo = false
    chooseThree = false
    chooseFour = false
    chooseFive = false
    chooseSix = false
    chooseSeven = false
    chooseEight = false
    chooseNine = false
    chooseTen = false
    chooseTenOne = false
    chooseTenTwo = false
    chooseTenThree = false
    chooseTenFive = false
    chooseTenSix = false
    chooseTenSeven = false
  }
  function choose15() {
    chooseTenFive = true
    chooseOne = false
    chooseTwo = false
    chooseThree = false
    chooseFour = false
    chooseFive = false
    chooseSix = false
    chooseSeven = false
    chooseEight = false
    chooseNine = false
    chooseTen = false
    chooseTenOne = false
    chooseTenTwo = false
    chooseTenThree = false
    chooseTenFour = false
    chooseTenSix = false
    chooseTenSeven = false
  }
  function choose16() {
    chooseTenSix = true
    chooseOne = false
    chooseTwo = false
    chooseThree = false
    chooseFour = false
    chooseFive = false
    chooseSix = false
    chooseSeven = false
    chooseEight = false
    chooseNine = false
    chooseTen = false
    chooseTenOne = false
    chooseTenTwo = false
    chooseTenThree = false
    chooseTenFour = false
    chooseTenFive = false
    chooseTenSeven = false
  }
  function choose17() {
    chooseTenSeven = true
    chooseOne = false
    chooseTwo = false
    chooseThree = false
    chooseFour = false
    chooseFive = false
    chooseSix = false
    chooseSeven = false
    chooseEight = false
    chooseNine = false
    chooseTen = false
    chooseTenOne = false
    chooseTenTwo = false
    chooseTenThree = false
    chooseTenFour = false
    chooseTenFive = false
    chooseTenSix = false
  }
</script>
<!--{#if messageStatus }-->
<!--<div class="notification">-->
<!--<button class="delete" on:click={close}></button>-->
<!--{messages}-->
<!--</div>-->
<!--{/if}-->
<nav class="categories">
		<div class="navbar-brand">
				<img src="images/newlogo.png" alt="">
		</div>
		{#if isAdmin }
		<div class="category">
				<header class="category-header">
						<div class="category-name">
								<div class="columns">
										<div class="column is-2"></div>
										<div class="column is-6 rowCenter">
												<img src="images/notice.png" alt="" width="24px">
												<div class="title is-5">
														<a class="nav-item-main" href="/announcement" use:link>
																公告管理
														</a>
												</div>
										</div>
										<div class="column is-2">
										</div>
								</div>
						</div>
				</header>
		</div>
		{/if}
		<!--///-->
		<div class="category">
				<header class="category-header">
						<div class="category-name">
								<div class="columns" on:click={adminOpen}>
										<div class="column is-2"></div>
										<div class="column is-6 rowCenter">
												<img src="images/vip.png" alt="" width="24px">
												<div class="title ">
														<a class="nav-item-main rowCenter">
																会员管理
																<!--<img src="" alt="">-->
														</a>
												</div>
										</div>
										{#if adminOpenStatus }
										<div class="column is-1">
												<i class="fa fa-sort-desc colorWhite" aria-hidden="true"></i>
										</div>
										{:else}
										<div class="column is-1">
												<i class="fa fa-sort-asc colorWhite" aria-hidden="true"></i>
										</div>
										{/if}
										<div class="column is-2">

										</div>
								</div>
						</div>
				</header>
				{#if adminOpenStatus }
				<ul class="category-list">
						{#if isAdmin }
						<li on:click={choose1}>
								<div class="columns">
										<div class="column is-3 rowCenter"></div>
										<div class="column">
												<a class="nav-item" href="/twoagents" use:link>
														<span style={chooseOne?'color:#318AFD;font-size:16px':''}>二级代理管理</span>
												</a>
										</div>
								</div>
						</li>
						{/if}
						<li on:click={choose2}>
								<div class="columns">
										<div class="column is-3 rowCenter"></div>
										<div class="column">
												<a class="nav-item" href="/threeagents" use:link>
														<span style={chooseTwo?'color:#318AFD;font-size:16px':''}>三级代理管理</span>
												</a>
										</div>
								</div>
						</li>

						<li  on:click={choose3}>
								<div class="columns">
										<div class="column is-3 rowCenter"></div>
										<div class="column">
												{#if isAdmin}
												<a class="nav-item" href="/users" use:link>
														<span style={chooseThree?'color:#318AFD;font-size:16px':''}>用户管理</span>
												</a>
												{:else}
												<a class="nav-item" href={agent_users} use:link>
														<span style={chooseThree?'color:#318AFD;font-size:16px':''}>用户管理</span>
												</a>
												{/if}
										</div>
								</div>
						</li>
				</ul>
				{/if}
		</div>
		<!--/////-->
		<!--///-->
		{#if isAdmin }
		<div class="category">
				<header class="category-header">
						<div class="category-name">
								<div class="columns" on:click={verOpen}>
										<div class="column is-2"></div>
										<div class="column is-6 rowCenter">
												<img src="images/vip.png" alt="" width="24px">
												<div class="title is-5">
														<a class="nav-item-main positionLoc">
																实名认证
																<span style={veri==0?'display:none':''} class="redPoint">{veri}</span>
														</a>
												</div>
										</div>
										{#if verOpenStatus }
										<div class="column is-1">
												<i class="fa fa-sort-desc colorWhite" aria-hidden="true"></i>
										</div>
										{:else}
										<div class="column is-1">
												<i class="fa fa-sort-asc colorWhite" aria-hidden="true"></i>
										</div>
										{/if}
										<div class="column is-2"></div>
								</div>
						</div>
				</header>
				{#if verOpenStatus }
				<ul class="category-list">
						{#if isAdmin }
						<li on:click={choose5}>
								<div class="columns">
										<div class="column is-3 rowCenter"></div>
										<div class="column">
												<a class="nav-item positionLoc" href="/user/verisno" use:link>
														<span style={chooseFive?'color:#318AFD;font-size:16px':''}>
																待审核
														</span>
														<span style={veri==0?'display:none':''} class="redPoint">{veri}</span>
												</a>
										</div>
								</div>
						</li>
						<li  on:click={choose6}>
								<div class="columns">
										<div class="column is-3 rowCenter"></div>
										<div class="column">
												<a class="nav-item" href="/user/verisyes" use:link>
														<span style={chooseSix?'color:#318AFD;font-size:16px':''}>
																已审核
														</span>
												</a>
										</div>
								</div>
						</li>
						<!--<li>-->
						<!--<div class="columns">-->
						<!--<div class="column is-3 rowCenter"></div>-->
						<!--<div class="column">-->
						<!--<a class="nav-item" href="/user/verisreject" use:link>-->
						<!--被拒绝-->
						<!--</a>-->
						<!--</div>-->
						<!--</div>-->
						<!--</li>-->
						{/if}
				</ul>
				{/if}
		</div>
		{/if}


		<!--22222-->
		<div class="category">
				<header class="category-header">
						<div class="category-name">
								<div class="columns" on:click={moneyOpen}>
										<div class="column is-2"></div>
										<div class="column is-6 rowCenter">
												<img src="images/cash.png" alt="" width="24px">
												<div class="title is-5 ">
														<a class="nav-item-main">
																资金总览
														</a>
												</div>
										</div>
										{#if moneyOpenStatus }
										<div class="column is-1">
												<i class="fa fa-sort-desc colorWhite" aria-hidden="true"></i>
										</div>
										{:else}
										<div class="column is-1">
												<i class="fa fa-sort-asc colorWhite" aria-hidden="true"></i>
										</div>
										{/if}
										<div class="column is-2"></div>
								</div>
						</div>
				</header>
				{#if moneyOpenStatus }
				<ul class="category-list">
						<!--{#if isAdmin }-->
						<!--<li>-->
						<!--<div class="columns">-->
						<!--<div class="column is-3 rowCenter"></div>-->
						<!--<div class="column">-->
						<!--<a class="nav-item" href="/platform/assets" use:link>-->
						<!--平台资金管理-->
						<!--</a>-->
						<!--</div>-->
						<!--</div>-->
						<!--</li>-->
						<!--{/if}-->
						<li on:click={choose7}>
								<div class="columns">
										<div class="column is-3 rowCenter"></div>
										<div class="column">
												<a class="nav-item" href="/users/assets" use:link>
														<span style={chooseSeven?'color:#318AFD;font-size:16px':''}>
																用户资金管理
														</span>
												</a>
										</div>
								</div>
						</li>
				</ul>
				{/if}
		</div>
		<!--22222333-->

		<div class="category">
				<header class="category-header">
						<div class="category-name">
								<div class="columns" on:click={cashOpen}>
										<div class="column is-2"></div>
										<div class="column is-6 rowCenter">
												<img src="images/cash.png" alt="" width="24px">
												<div class="title is-5">
														<!--{#if isAdmin }-->
														<a class="nav-item-main positionLoc">
																充提币 <span style={withdraw==0?'display:none':''} class="redPoint">{withdraw}</span>
														</a>
														<!--{:else}-->
														<!--提现管理-->
														<!--{/if}-->
												</div>
										</div>
										{#if cashOpenStatus }
										<div class="column is-1">
												<i class="fa fa-sort-desc colorWhite" aria-hidden="true"></i>
										</div>
										{:else}
										<div class="column is-1">
												<i class="fa fa-sort-asc colorWhite" aria-hidden="true"></i>
										</div>
										{/if}
										<div class="column is-2"></div>
								</div>
						</div>
				</header>
				{#if cashOpenStatus }
				<ul class="category-list">

						<!--{#if isAdmin }-->
						<li on:click={choose8}>
								<div class="columns">
										<div class="column is-3 rowCenter"></div>
										<div class="column">
												<a class="nav-item positionLoc" href="/user/withdraws1" use:link>

														<span style={chooseEight?'color:#318AFD;font-size:16px':''}>
																待审核
														</span>
														<span style={withdraw==0?'display:none':''} class="redPoint">{withdraw}</span>
												</a>
										</div>
								</div>
						</li>
						<li on:click={choose9}>
								<div class="columns">
										<div class="column is-3 rowCenter"></div>
										<div class="column">
												<a class="nav-item" href="/user/withdraws2" use:link>
														<span style={chooseNine?'color:#318AFD;font-size:16px':''}>
																已审核
														</span>
												</a>
										</div>
								</div>
						</li>
						<li  on:click={choose10}>
								<div class="columns">
										<div class="column is-3 rowCenter"></div>
										<div class="column">
												<a class="nav-item " href="/user/withdraws3" use:link>
														<span style={chooseTen?'color:#318AFD;font-size:16px':''}>
																提币记录
														</span>
												</a>
										</div>
								</div>
						</li>
						<li on:click={choose11}>
								<div class="columns">
										<div class="column is-3 rowCenter"></div>
										<div class="column">
												<a class="nav-item " href="/user/withdraws4" use:link>
												<span style={chooseTenOne?'color:#318AFD;font-size:16px':''}>
																充币记录
												</span>
												</a>
										</div>
								</div>
						</li>
						<!--{/if}-->
				</ul>
				{/if}
		</div>


		<!--44444-->
		<div class="category">
				<header class="category-header">
						<div class="category-name">
								<div class="columns" on:click={corpoOpen}>
										<div class="column is-2"></div>
										<div class="column is-6 rowCenter">
												<img src="images/account.png" alt="" width="24px">
												<a class=" is-5 nav-item-main">
														合约管理
												</a>
										</div>
										{#if corpoOpenStatus }
										<div class="column is-1">
												<i class="fa fa-sort-desc colorWhite" aria-hidden="true"></i>
										</div>
										{:else}
										<div class="column is-1">
												<i class="fa fa-sort-asc colorWhite" aria-hidden="true"></i>
										</div>
										{/if}
										<div class="column is-2">
										</div>
								</div>
				</header>
				{#if corpoOpenStatus }
				<ul class="category-list">
						<li on:click={choose12}>
								<div class="columns">
										<div class="column is-3 rowCenter"></div>
										<div class="column">
												<a class="nav-item" href="/contract/hold" use:link>
														<span style={chooseTenTwo?'color:#318AFD;font-size:16px':''}>
																当前持仓
												</span>

												</a>
										</div>
								</div>
						</li>
						<li on:click={choose13}>
								<div class="columns">
										<div class="column is-3 rowCenter"></div>
										<div class="column">
												<a class="nav-item" href="/contract/delegate" use:link>
														<span style={chooseTenThree?'color:#318AFD;font-size:16px':''}>
																当前委托
												</span>

												</a>
										</div>
								</div>
						</li>
						<li on:click={choose14}>
								<div class="columns">
										<div class="column is-3 rowCenter"></div>
										<div class="column">
												<a class="nav-item" href="/contract/finished" use:link>

														<span style={chooseTenFour?'color:#318AFD;font-size:16px':''}>
																平仓记录
												</span>

												</a>
										</div>
								</div>
						</li>
				</ul>
				{/if}
		</div>
		<div class="category">
				<header class="category-header">
						<div class="category-name">
								<div class="columns" on:click={otcOpen}>
										<div class="column is-2"></div>
										<div class="column is-6 rowCenter">
												<img src="images/cash.png" alt="" width="24px">
												<div class="title is-5">
														<a class="nav-item-main positionLoc">
																OTC <span style={(otcBuy+otcSell)==0?'display:none':''} class="redPoint">{otcBuy+otcSell}</span>
														</a>
												</div>
										</div>
										{#if otcOpenStatus }
										<div class="column is-1">
												<i class="fa fa-sort-desc colorWhite" aria-hidden="true"></i>
										</div>
										{:else}
										<div class="column is-1">
												<i class="fa fa-sort-asc colorWhite" aria-hidden="true"></i>
										</div>
										{/if}
										<div class="column is-2"></div>
								</div>
						</div>
				</header>
				{#if otcOpenStatus }
				<ul class="category-list">
						<li on:click={choose15}>
								<div class="columns">
										<div class="column is-3 rowCenter"></div>
										<div class="column rowCenter">
												<a class="nav-item positionLoc" href="/otc/otcno" use:link>

												<!-- <span style={chooseTenFive?'color:#318AFD;font-size:16px':''}>
																待处理
												</span> -->
														<span style={(otcBuy+otcSell)==0?'display:none':''} class="redPoint">{otcBuy + otcSell}</span>
												</a>
										</div>
								</div>
						</li>
						<li on:click={choose16}>
								<div class="columns">
										<div class="column is-3 rowCenter"></div>
										<div class="column rowCenter">
												<a class="nav-item positionLoc" href="/otc/otcyes" use:link>

														<span style={chooseTenSix?'color:#318AFD;font-size:16px':''}>
																已完结
												</span>
												</a>
										</div>
								</div>
						</li>
				</ul>
				{/if}
		</div>
		{#if isAdmin }
		<div class="category">
				<header class="category-header">
						<div class="category-name">
								<div class="columns">
										<div class="column is-2"></div>
										<div class="column is-6 rowCenter">
												<img src="images/cash.png" alt="" width="24px">
												<div class="title is-5">
														<a class="nav-item-main" href="/app/currencymanagement" use:link>
																卖币管理<span style={(otcBuy+otcSell)==0?'display:none':''} class="redPoint">{otcBuy+otcSell}</span>
														</a>
												</div>
										</div>
										<div class="column is-2">
										</div>
								</div>
						</div>
				</header>
		</div>
		<div class="category">
				<header class="category-header">
						<div class="category-name">
								<div class="columns" on:click={accountOpen}>
										<div class="column is-2"></div>
										<div class="column is-6 rowCenter">
												<img src="images/password.png" alt="" width="24px">

												<div class="title is-5">
														<a class="nav-item-main">
																账户管理
														</a>
												</div>
										</div>
										{#if accountOpenStatus }
										<div class="column is-1">
												<i class="fa fa-sort-desc colorWhite" aria-hidden="true"></i>
										</div>
										{:else}
										<div class="column is-1">
												<i class="fa fa-sort-asc colorWhite" aria-hidden="true"></i>
										</div>
										{/if}
										<div class="column is-2"></div>
								</div>
						</div>
				</header>
				{#if accountOpenStatus }
				<ul class="category-list">
						<li on:click={choose17}>
								<div class="columns">
										<div class="column is-3 rowCenter"></div>
										<div class="column rowCenter">
												<a class="nav-item " href="/admin/pwd/modify" use:link>
														<span style={chooseTenSeven?'color:#318AFD;font-size:16px':''}>
																修改密码
												</span>
												</a>
										</div>
								</div>
						</li>
				</ul>
				{/if}
		</div>
		<div class="category" style="display: none;">
				<header class="category-header">
						<div class="category-name">
								<div class="columns">
										<div class="column is-2"></div>
										<div class="column is-6 rowCenter">
												<img src="images/account.png" alt="" width="24px">
												<div class="title is-5">
														<a class="nav-item-main" href="/app/managepackage" use:link>
																管理上传包
														</a>
												</div>
										</div>
										<div class="column is-2">
										</div>
								</div>
						</div>
				</header>
		</div>
		<div class="category">
				<header class="category-header">
						<div class="category-name">
								<div class="columns">
										<div class="column is-2"></div>
										<div class="column is-6 rowCenter">
												<img src="images/notice.png" alt="" width="24px">
												<div class="title is-5">
														<a class="nav-item-main" href="/app/version" use:link>
																版本更新
														</a>
												</div>
										</div>
										<div class="column is-2">
										</div>
								</div>
						</div>
				</header>
		</div>
		<div class="category">
				<header class="category-header">
						<div class="category-name">
								<div class="columns">
										<div class="column is-2"></div>
										<div class="column is-6 rowCenter">
												<img src="images/contact.png" alt="" width="24px">
												<div class="title is-5">
														<a class="nav-item-main" href="/app/contact" use:link>
																联系我们
														</a>
												</div>
										</div>
										<div class="column is-2">
										</div>
								</div>
						</div>
				</header>
		</div>
		
		{/if}
</nav>

<style>
		@media (min-width: 769px){
			.column.is-6, .column.is-6-tablet {
			    flex: none;
			    width: 55%;
			}
		}/* 上传包管理兼容 */
		.positionLoc {
				position: relative;
		}

		.redPoint {
				position: absolute;
				top: -4px;
				right: -20px;
				width: 18px;
				height: 18px;
				font-size: 8px;
				display: flex;
				justify-content: center;
				align-items: center;
				background-color: #FF2D2D;
				border-radius: 50%;
		}

		nav {
				background-color: #030D21;
				height: 100vh;
		}

		.navbar-brand {
				padding: 10px 20px;
				display: flex;
				justify-content: center;
				align-items: center;
		}

		.category-header {
				padding: 5px 10px;
		}

		a, .title, .nav-item {
				font-weight: 400;
				color: #fff;
				font-size: 14px;
		}

		a, .title, .nav-item-main {
				font-weight: 400;
				color: #fff;
				font-size: 16px;
				/*margin-left: 20px;*/
		}

		a, .title, .nav-item-all {
				font-weight: 400;
				color: #fff;
				font-size: 20px;
		}

		li {
				font-size: 80%
		}

		.category {
				padding: 5px 0;
		}

		.category header {
				padding: 15px 0;
		}

		.categories {
				overflow-y: auto;
		}

		.active {
				background-color: #fff;
				color: #000;
		}

		.rowCenter {
				display: flex;
				flex-direction: row;
				align-items: center;
		}

		.rowReverse {
				display: flex;
				flex-direction: row-reverse;
				align-items: center;
		}

		.notification {
				position: absolute;
				top: 66px;
				right: 0;
				color: #FF2D2D;
				width: 30vw;
				height: 80px;
				text-align: center;
				font-size: 18px;
				border: 1px solid #eeeeee;
				background-color: #ffffff;
				z-index: 9999;
		}
</style>
